<template>
  <a-card title="我的错题">
    <a-list
      :data-source="mistakes"
      :render-item="renderItem"
      bordered
      v-if="mistakes.length"
    />
    <a-empty v-else description="暂无错题记录" />
  </a-card>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { message } from 'ant-design-vue'
import { listByUserId } from '@/api/bizQuestionMistakeController'
import axios from 'axios'

const mistakes = ref([])

const fetchMistakes = async () => {
  try {
    const res = await listByUserId()
    mistakes.value = res.data.data
  } catch (err) {
    message.error('加载错题失败')
  }
}

onMounted(fetchMistakes)

const renderItem = (item) => {
  return (
    <a-list-item>
      <a-list-item-meta
        title={`题目ID：${item.questionId}`}
        description={`用户ID：${item.userId}`}
      />
    </a-list-item>
  )
}
</script>
